* {
  font-family: "微软雅黑";
}

.container {
  width: 100%;
  min-height: 100vh;
  box-sizing: border-box;
  padding: 14px 20px;
}

.container .navbar {
  border-radius: 8px;
}

/* .container .navbar .navbar-title {
    height: 35px;
    line-height: 35px;
  } */

.container .tuangou .navbar-title .has-border {
  position: relative;
  display: inline-block;
  padding: .5em 1em .35em;
  color: #2D3341;
  width: 49%;
  text-align: center;
}

.container .waimai .navbar-title .no-border {
  position: relative;
  display: inline-block;
  padding: .5em 1em .35em;
  color: #2D3341;
  width: 49%;
  text-align: center;
}

.container .tuangou .navbar-title .no-border {
  position: relative;
  display: inline-block;
  padding: .5em 1em .35em;
  color: #2D3341;
  width: 49%;
  text-align: center;
}

.container .waimai .navbar-title .has-border {
  position: relative;
  display: inline-block;
  padding: .5em 1em .35em;
  color: #2D3341;
  width: 49%;
  text-align: center;
}

.container .tuangou .navbar-title .no-border::before {
  content: '';
  /*用伪元素来生成一个矩形*/
  border-top-left-radius: 8px;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: -1;
  background: #ffffff;
  transform: scaleY(1) perspective(1.5em) rotateX(3deg);
  transform-origin: right;
}

.container .waimai .navbar-title .has-border::before {
  content: '';
  /*用伪元素来生成一个矩形*/
  border-top-right-radius: 8px;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: -1;
  background: #ffffff;
  transform: scaleY(1) perspective(1.5em) rotateX(3deg);
  transform-origin: left;
}

/* .container .navbar .navbar-title .has-border {
    border-top-right-radius: 20px;
    background: #fff;
  }

  .container .navbar .navbar-title .no-border {
    background: #8D97B1;
  } */

.container .navbar-content-waimai {
  background: #fff;
  padding: 15px;
  border-bottom-left-radius: 8px;
  border-bottom-right-radius: 8px;
}

.container .navbar-content-waimai .first-content {
  margin-bottom: 10px;
}

.container .navbar-content-waimai .navbar-content-list {
  display: flex;
  justify-content: space-between;
}

.container .navbar-content-waimai .navbar-content-list p {
  margin-bottom: 0;
}

.container .navbar-content-waimai .navbar-content-list .time {
  font-size: 14px;
  color:rgba(64,94,216,1);
}

.container .navbar-content-waimai .navbar-content-list .select {
  font-size: 20px;
  font-weight: 800;
  color: #2D3341;
}

.container .navbar-content-tuangou {
  background: #fff;
  padding: 15px;
  border-bottom-left-radius: 8px;
  border-bottom-right-radius: 8px;
}

.container .navbar-content-tuangou .navbar-content-local {
  display: flex;
  justify-content: space-between;
}

.container .navbar-content-tuangou .navbar-content-local h5 {
  font-size: 20px;
  color: #2D3341;
  font-weight:800;
}

.container .navbar-content-tuangou .navbar-content-local p {
  font-size: 12px;
  color: #FF0000;
  margin-top: 6px;
}

.container .navbar-content-tuangou p {
  font-size: 12px;
  color: #000000;
}

.container .navbar-content-waimai p {
  font-size: 12px;
  color: #000000;
}

.container .content {
  background: #fff;
  border-radius: 8px;
  padding: 15px;
  margin-top: 15px;
}

.container .content .contane-title {
  font-size: 14px;
  color: #717071;
}

.container .content .detail {
  display: flex;
  margin-bottom: 10px;
  justify-content: space-between;
}

.container .content .detail .detail-flex {
  display: flex;
}

.container .content .detail img {
  width: 70px;
  height: 68px;
  max-width: 70px;
  margin-right: 12px;
}

.container .content .detail h4 {
  font-size: 18px;
  color: #000000;
  font-weight: 500;
  margin-bottom: 16px;
}

.container .content .detail h5 {
  text-align: right;
  font-size: 18px;
  color: #000000;
  margin-bottom: 16px;
}

.container .content .detail p {
  color:rgba(180,181,181,1);
  margin-bottom: 0;
}

.container .content .detail span {
  color: rgba(255,255,255,1);
  background: #3F5DD7;
  font-size: 10px;
  padding: 4px 6px;
  border-radius: 4px;
}

.container .content .detail-list {
  display: flex;
  justify-content: space-between;
}

.container .content .detail-list h5{
  font-size: 12px;
  font-weight:500;
  color:rgba(45,51,65,1);
}

.container .content .detail-list img{
  width: 15px;
  margin: 0 2px -2px 0;
}

.container .content .detail-list-image h5 {
  font-size: 10px;
}

.container .content .detail-list p{
  font-weight:500;
  color:rgba(0,0,0,1);
  font-size: 14px;
  font-family:PingFang SC;
}

.container .content .detail-list-image p {
  color: #FF0000;
}

.container .content .detail-list .detail-rule{
  font-size: 10px;
}

.container .content .detail-list .detail-all{
  font-size: 10px;
}

.container .content .detail-list .detail-all span{
  font-size: 15px;
}

.container .phone {
  background: #fff;
  border-radius: 8px;
  padding: 15px;
  margin-top: 15px;
}

.container .phone .phone-check {
  display: flex;
  justify-content: space-between;
}

.container .phone .phone-check .phone-protect {
  color: #2D3341;
  font-size: 15px;
}

.container .phone .phone-check .phone-protect img {
  width: 12px;
  margin: 0 5px -2px 0;
}

.container .phone .phone-tip1 {
  font-size: 10px;
  color: #000000;
}

.container .phone .phone-tip2 {
  font-size: 10px;
  color: #405ED7;
  margin-bottom: 0;
}

.container .remarks {
  background: #fff;
  border-radius: 8px;
  padding: 15px;
  margin-top: 15px;
}

.container .remarks .select-detail {
  display: flex;
  justify-content: space-between;
}

.container .remarks .select-detail label {
  display: flex;
}

.container .remarks div h5 {
  font-size: 14px;
  color: #2D3341;
}

.container .remarks div p {
  color: #898989;
  font-size: 14px;
}

.container .need-know {
  background: #fff;
  border-radius: 8px;
  padding: 15px;
  margin-top: 15px;
}

.container .need-know .need-know-title{
  font-size: 15px;
  color: #000000;
  border-bottom: 1px solid #717071;
  font-weight: bold;
    padding-bottom: 10px;
}

.container .need-know .need-know-content div{
  display: flex;
  justify-content: space-between;
}

.container .need-know .need-know-content .need-know-content-title{
  color: #717071;
  font-size: 13px;
}

.container .need-know .need-know-content .need-know-content-detail{
  color: #000000;
  font-size: 11px;
}

.container .phone-konw {
  background: #fff;
  border-radius: 8px;
  padding: 15px;
  margin-top: 15px;
  display: flex;
  justify-content: space-between;
}

.container .phone-konw h4 {
  color: #000000;
  font-size: 15px;
}

.container .phone-konw p {
  color: #717071;
  font-size: 12px;
}

.container .submit {
  background: #8D97B1;
  border-radius: 8px;
  padding: 15px;
  margin-top: 15px;
  display: flex;
  justify-content: space-between;
}

.container .submit p {
  color: #fff;
  margin-bottom: 0;
  font-size: 12px;
}

.container .submit p span {
  font-size: 14px;
}

.container .submit .sumbit-pay {
  font-size: 14px;
}

.container .submit .sumbit-pay::before{
  content: ' ';
    width: 1px;
    height: 28px;
    background: #fff;
    display: inline-block;
    margin: -8px 24px -8px 0;
}

.takeaway .navbar-content-tuangou {
  display: none;
}

.group .navbar-content-waimai {
  display: none;
}

.group .is-waimai {
  display: none !important;
}

.group .phone{
  display: none !important;
}

.group .remarks{
  display: none !important;
}

.takeaway .need-know {
  display: none !important;
}

.takeaway .phone-konw{
  display: none !important;
}

.address-list {
  top: 28%;
    left: 10%;
    width: 80%;
    max-height: 60%;
    position: fixed;
}

.address-list .address-list-title {
  padding: 14px 14px 0;
}

.address-list .address-list-title p {
  text-align: center;
  font-size: 18px;
  color: #2D3341;
}

.address-list .address-list-title i{
  float: right;
  font-size: 24px;
}

.address-list .address-list-title .mui-table-view-cell p{
  color: #2D3341;
  font-size: 15px;
}

.address-list .address-list-title .mui-table-view-cell h5{
  color: #727171;
  font-size: 12px;
}

.remarks-pop .remarks-list-title {
  display: flex;
  padding: 14px 10px 0;
}

.remarks-pop .remarks-list-title .remarks-pop-title {
  width: 90%;
  text-align: center;
  font-size: 18px;
  color: #2D3341;
}

.remarks-pop .remarks-list-title .close-remarks {
  font-size: 14px;
}

.remarks-pop textarea {
  margin: 0 5% 14px;
  width: 90%;
}

.address-list .tableware-list p{
  text-align: center;
  color: #2D3341;
  height: 42px;
}
.address-list .tableware-list .tableware-active {
  color: #2b8bf2;
}
.address-list .tableware-list p span {
  color: #B5B5B6;
  font-size: 12px;
}